<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>transition过渡动画</title>
    <script src="https://unpkg.com/vue@next"></script>
  </head>
  <body>
    <div id="Application">
      <div :style="{backgroundColor : 'blue', width: width +'px', height: height + 'px'}" @click="run">
      </div>
    </div>
  </body>

  <script>
    const App = Vue.createApp({
        data(){
            return {
                width: 100,
                height: 100,
                timer : null,
            }
        },
        methods:{
            run() {
                this.timer = setInterval(this.animation, 10);
            },
            animation(){
                if(this.width == 200){
                    clearInterval(this.timer);
                }else{
                    this.width +=1
                    this.height +=1
                }
            }
        }
    })
    App.mount("#Application")
  </script>

</html>